{include file="common/public/header"}
<style type="text/css">
    .layui-anim.layui-icon {
        display: none;
    }
    .layui-icon layui-icon-ok{
        display: none;
    }
    .layui-input-block .layui-form-checkbox i {
        display: none;
    }
    .layui-form-radio>i:hover, .layui-form-radioed>i {
        color: #fff;
    }
    .layui-form-radio>i {
        margin-right: 8px;
        font-size: 22px;
        color: #fff;
    }
    .layui-form-radio {
        margin: 0 15px 0 0;
        cursor: pointer;
        background: #fff;
        color: rgba(0,0,0,.9);
        border: 1px solid #d9dfff;
        width: 70px;
        height: 30px;
        line-height: 30px;
        text-align: center;
        padding: 0 10px;
    }

    .layui-input-block .layui-form-checkbox {
        position: relative;
        height: 30px;
        line-height: 30px;
        padding: 0;
        cursor: pointer;
        font-size: 0px;
        box-sizing: border-box;
        transition: all 0.1s linear 0s;
        background: #fff;
        color: rgba(0,0,0,.9);
        margin-right: 15px;
    }
    .layui-form-checkbox span {
        padding: 0 10px;
        height: 100%;
        font-size: 14px;
        border-radius: 2px 0 0 2px;
        border: 1px solid #d9dfff;
        overflow: hidden;
        width: 70px;
        text-align: center;
        background: #fff;
        color: rgba(0,0,0,.9);
    }
    .layui-form-checkbox, .layui-form-checked span, .layui-form-checked:hover span {
        background-color: #ecf0ff;
        color: #4060ff;
    }
     .layui-form-checked{
        background-color: #ecf0ff;
        color: #4060ff;
    }
    .layui-form-radioed {
        background-color: #ecf0ff;
        color: #4060ff;
    }

</style>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-card">
            <div class="layui-card-header">{$page_title}</div>
            <div class="layui-card-body">
                <form class="layui-search layui-form" action="" method="get">
                    <div class="layui-form-item">
                        <label class="layui-form-label">频道</label>
                        <div class="layui-input-block">
                            <input type="radio" name="wc_id" value="" title="全部" checked>
                            {foreach $works_channel as $item}
                            <input type="radio" name="wc_id" value="{$item.value}" title="{$item.title}" >
                            {/foreach}
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">类型(题材）</label>
                        <div class="layui-input-block">
                            <input type="radio" name="wt_id" value="" title="全部" checked>
                            {foreach $works_theme as $item}
                            <input type="radio" name="wt_id" value="{$item.value}" title="{$item.title}" >
                            {/foreach}
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">编辑评级</label>
                        <div class="layui-input-block">
                            <input type="radio" name="wl_id" value="" title="全部" checked>
                            {foreach $works_level as $item}
                            <input type="radio" name="wl_id" value="{$item.value}" title="{$item.title}" >
                            {/foreach}
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">短剧标签</label>
                        <div class="layui-input-block">
                            <input type="checkbox" name="wls_id" value="" title="全部" data-status="1">
                            {foreach $works_label as $item}
                            <input type="checkbox" name="wls_id[]" value="{$item.value}" title="{$item.title}" >
                            {/foreach}
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">集数筛选</label>
                        <div class="layui-input-block">
                            <input type="radio" name="sn_id" value="" title="全部" checked>
                            <input type="radio" name="sn_id" value="1" title="0-50" >
                            <input type="radio" name="sn_id" value="2" title="5-100" >
                            <input type="radio" name="sn_id" value="3" title="100-150" >
                            <input type="radio" name="sn_id" value="4" title="150-200" >
                            <input type="radio" name="sn_id" value="5" title="200以上" >
                        </div>
                    </div>


                    <div class="layui-clear"></div>
                </form>


                <table id="table"></table>


                <script type="text/html" id="toolbar_row">
                    {:table_button('admin/Works/update',"编辑","frame")}
                    {:table_button('admin/Works/del', '删除', 'confirm')}
                    {:table_button('admin/Works/chapter_list',"章节列表","frame")}
                    {:table_button('admin/Works/add_chapter',"添加章节","frame")}
                </script>
                <!--分页按钮输出开始-->
                <div class="page">
                    {$page|raw}
                </div>
                <!--分页按钮输出结束-->
            </div>
        </div>
    </div>
</div>
<script src="/static/js/site.js"></script>
{include file="common/public/footer" /}

<script>
    layui.use(['index', 'table', 'form', 'laydate', 'layarea'], function () {
        var $ = layui.$;
        var form = layui.form;
        var table = layui.table;
        var laydate = layui.laydate;
        var layarea = layui.layarea;
        table.render({
            "limit": 15,
            "limits": [10, 15, 20, 30, 40, 50, 60, 70, 80, 90, 100],
            "elem": "#table",
            "height": "full",
            "url": "/admin/Works/list.html",
            "page": true,
            "method": "POST",
            "cols": [[
                {"field": "id", "title": "ID", "align": "center", "width": '5%'},
                {"field": "cover_img","title": "封面图","align": "center"},
                {"field": "details", "title": "短剧详情", "width": '20%'},
                {"field": "type","title": "类型","align": "center"},
                {"field": "level_name","title": "编辑评级","align": "center"},
                {"field": "update_status","title": "连载状态","align": "center"},
                {"field": "charge_status","title": "限免","align": "center"},
                {"field": "charge_type","title": "收费类型","align": "center"},
                {"field": "charge_node","title": "收费起始章节","align": "center","edit":true},
                {"field": "price","title": "价格(元)","align": "center","edit":true},
                {"field": "status_switch","title": "状态","align": "center"},
/*                {"field": "add_time","title": "添加时间","align": "center"},
                {"field": "up_time","title": "修改时间","align": "center"},*/
                {"title": "操作", "width": 300, "fixed": "right", "toolbar": "#toolbar_row"}]],
            "toolbar": "<div><a data-url=\"/admin\/Works/add.html\" data-text=\"添加\" data-param=\"['90%', '90%']\" class=\"layui-btn layui-btn-sm  \" lay-event=\"frame\">添加<\/a><\/div>",
            "defaultToolbar": ["filter", "print"]
        });

        // 排序 按钮监听
        table.on('sort()', function (obj) {
            table.reload('table', {
                initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
                , where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                    field: obj.field, //排序字段   在接口作为参数字段  field order
                    order: obj.type, //排序方式   在接口作为参数字段  field order
                },
            });
        });

        // toolbar 按钮监听
        table.on('tool()', function (data) {
            var url = layui.$(this).data('url');
            var text = layui.$(this).data('text');
            var param = layui.$(this).data('param');
            if (data.event == 'url') {
                location.href = url + '?id=' + data.data.id;
            } else if (data.event == 'confirm') {
                var url = url + '?id=' + data.data.id;
                confirm(url, text);
            } else if (data.event == 'frame') {
                open_frame(url + '?id=' + data.data.id, text, eval(param));
            } else if (data.event == 'prompt') {
                _prompt(url + '?id=' + data.data.id, text);
            }
        });

        // toolbar_row 按钮监听
        table.on('toolbar()', function (data) {
            var url = layui.$(this).data('url') + '';
            var text = layui.$(this).data('text');
            var param = layui.$(this).data('param');
            if (data.event == 'url') {
                location.href = url;
            } else if (data.event == 'batch') {
                var checked = table.checkStatus('table').data;
                var id = [];
                for (var i = 0; i < checked.length; i++) {
                    id.push(checked[i].id);
                }
                if (id.length == 0) {
                    alert_error('请至少选择一行数据');
                    return false;
                }
                layer.confirm(text, {
                    btn: ['确认', '取消']
                }, function () {
                    Post(url, {id: id}, function (res) {
                        if (res.code == 1) {
                            alert_success(res.msg, function () {
                                table_reload();
                            });
                        } else {
                            alert_error(res.msg);
                        }
                    });
                });
            } else if (data.event == 'confirm') {
                confirm(url, text);
            } else if (data.event == 'frame') {
                open_frame(url, text, eval(param));
            } else if (data.event == 'upload') {
                _upload(url, text);
            }
        });

        // 开关监听
        form.on('switch(table_switch)', function (data) {
            var url = $(data.elem).data('url');
            Post(url, {checked: $(data.elem).is(":checked") ? 1 : 0}, function (res) {
                if (res.code == 1) {
                    table_reload();
                } else {
                    alert_error(res.msg);
                }
            });
        });

        // 行内编辑监听
        table.on('edit()', function (data) {
            Post('/admin/Works/row_edit.html', {id: data.data.id, field: data.field, value: data.value}, function (res) {
                if (res.code == 1) {
                    table_reload();
                } else {
                    alert_error(res.msg);
                }
            });
        });


        // 搜索
        var where = {};
        //多选
        $(document).on('click',".layui-form-checkbox",function(){
            var $ = layui.$, table = layui.table;
            var fields = {};
            fields['wc_id'] = $("input[name='wc_id']:checked").val();
            fields['wt_id'] = $("input[name='wt_id']:checked").val();
            fields['wl_id'] = $("input[name='wl_id']:checked").val();
            fields['sn_id'] = $("input[name='sn_id']:checked").val();

            var status = $(this).prev().attr('data-status');
            var status_class = $(this).attr('class');
            if (status == 1 && status_class == 'layui-unselect layui-form-checkbox layui-form-checked') {
                $(".layui-form-checkbox").attr('class','layui-unselect layui-form-checkbox layui-form-checked');
                $(".layui-form-checkbox").prev('input').attr('checked','checked');
            }else if(status == 1 && status_class == 'layui-unselect layui-form-checkbox'){
                $(".layui-form-checkbox").attr('class','layui-unselect layui-form-checkbox');
                console.log($("input[name='wls_id[]']:checked").val())
                $("input[name='wls_id[]']:checked").removeAttr('checked');
            }

            var wls_id = [];
            $('.layui-form-checked').prev('input').each(function(){
                wls_id.push($(this).val());
            });

            fields['wls_id'] = wls_id.join(",");
            console.log(fields)
            //window.where = fields;
            table.reload('table', {
                where: fields,
                page: {
                    curr: 1 // 重新从第 1 页开始
                },
            });
        });
        //是否在数组内
        function in_array(search,array){
            for(var i in array){
                if(array[i]==search){
                    return true;
                }
            }
            return false;
        }

        //单选
        $(document).on('click',".layui-form-radio",function(){
            var $ = layui.$, table = layui.table;
            var fields = {};
            fields['wc_id'] = $("input[name='wc_id']:checked").val();
            fields['wt_id'] = $("input[name='wt_id']:checked").val();
            fields['wl_id'] = $("input[name='wl_id']:checked").val();
            fields['sn_id'] = $("input[name='sn_id']:checked").val();
            var wls_id = [];
            $('.layui-form-checked').prev('input').each(function(){
                wls_id.push($(this).val());
            });
            fields['wls_id'] = wls_id.join(",");
            console.log(fields)
            //window.where = fields;
            table.reload('table', {
                where: fields,
                page: {
                    curr: 1 // 重新从第 1 页开始
                },
            });
        });

    });


    // 表格刷新
    function table_reload() {
        var table = layui.table;
        table.reload('table', {
            where: window.where
        })
    }


</script>
<script>
    layui.use(['index', 'form', 'table'], function () {
        var $ = layui.$;
        var table = layui.table;

    });
</script>